import * as React from 'react'
import './index.scss'
import Login from '../Login'
import AlertBoxes from '../../containers/AlertBoxes'

let DesCnt = () => {
    let rule = [
        {
            name: "Ngân hàng nhờ hỗ trợ",
            des: "Dùng thẻ ngân hàng nạp tiền (nhờ hỗ trợ) vào tài khoản"
        },
        {
            name: "Ngân hàng tự thao tác",
            des: "Dùng thẻ ngân hàng nạp tiền vào tài khoản"
        },
        {
            name: "Thẻ cào",
            des: "Nạp tiền vào tài khoản bằng thẻ cào"
        },
        {
            name: "SMS",
            des: "Nạp tiền bằng tin nhắn điện thoại"
        }
    ];

    let username:any, password:any, checkbox:any;

    return (
        <div className="cnt">
            <div className="content">
                <div className="des">
                    <h2>Mua thẻ</h2>
                    <p className="line-wave"> </p>
                    {
                        rule.map((node, index) =>(
                            <p key={index}>
                                <span className="icon-list"> </span>
                                <span className="name">{node.name}</span>
                                <br/>
                                <span>{node.des}</span>
                            </p>
                        ))
                    }
                </div>

                <Login />
            </div>

            <AlertBoxes />
        </div>
    )
}

export default DesCnt




